$(function(){
	
	
	//添加
	$(".btn_add").click(function(){
		$(".panel_add").css({
			"display":"block",
		});
	})
	
	$(".btn_qx_add").click(function(){
		$(".panel_add").css({
			"display":"none",
		});
	})
	
	
	//修改
	$(".btn_edit").click(function(){
		$(".panel_upt").css({
			"display":"block",
		});
	})
	
	$(".btn_qx_upt").click(function(){
		$(".panel_upt").css({
			"display":"none",
		});
	})

	$(".btn_xg_add").click(function () {
        $.ajax({
            type: 'POST',
            url: '/api/music',
            data: {
                'name': $("#name").val(),
                'author':$("#author").val(),
                'url':$("#url").val()
            },
            success: function (result) {

                if (result.code==200) {
                    $(".panel_add").css({
                        "display":"none",
                    });
                    layer.msg(result.message);
                    initMusic();
                }else {
                    layer.msg(result.message,{icon: 5});
                }
            },
			error:function () {
                layer.msg("系统错误！",{icon: 5});
            }
        });
    });
	
	$(".btn_st_add").click(function () {
		var url = $("#url").val();
		$("#myaudio").attr("src",url);
        var myAuto = document.getElementById('myaudio');
        myAuto.play();
    })

	$(".btn_st_upt").click(function () {
		var url = $("#music_url2").val();
		$("#myaudio").attr("src",url);
        var myAuto = document.getElementById('myaudio');
        myAuto.play();
    })

	$(document).ready(function () {
	    initMusic();
    })


	$("#edit_submit").click(function () {
        $.ajax({
            type: 'put',
            url: '/api/music/',
			data:{
            	'id': $("#music_id").val(),
				'name':$("#music_name").val(),
				'author': $("#music_author").val(),
				'url': $("#music_url2").val()
			},
            success: function (result) {
                if (result.code==200) {
                    $(".panel_upt").css({
                        "display":"none",
                    });
                    layer.msg(result.message);
                    initMusic();
                }else {
                    layer.msg(result.message,{icon: 5});
                }
            },
            error:function () {
                layer.msg("系统错误！",{icon: 5});
            }
        });
    })

})


function playMusic(url) {
     $("#myaudio").attr("src",url);
     var myAuto = document.getElementById('myaudio');
     myAuto.play();
}

function editMusic(id) {
    $.ajax({
        type: 'get',
        url: '/api/music/'+id,
        success: function (result) {
            var data = result.data;
            $("#music_id").val(data.id);
            $("#music_name").val(data.name);
            $("#music_author").val(data.author);
            $("#music_url2").val(data.url);
        },
        error:function () {
            layer.msg("系统错误！",{icon: 5});
        }
    });
    $(".panel_upt").css({
        "display":"block",
    });
}

function delMusic(id) {
    $.ajax({
        type: 'delete',
        url: '/api/music/'+id,
        success: function (result) {
            if (result.code==200) {
                layer.msg(result.message);
                initMusic();
            }else {
                layer.msg(result.message,{icon: 5});
            }
        },
        error:function () {
            layer.msg("系统错误！",{icon: 5});
        }
    });
}


function initMusic(){
    $("#musicList").html("")
    $.ajax({
        type: 'get',
        url: '/api/music',
        success: function (result) {
            var data = result.data;
            $("#total").html(result.total)
            var val = "";
            data.forEach(function(value,index){
                val = val+"<tr><td>"+value.name+"</td>" +
                    "<td>"+value.author+"</td><td id='music_url'>"+value.url+"</td><td>" +
                    "<a role='button' class='btn_auditions'  onclick='playMusic(\""+value.url+"\")' style='border: 1px solid #09BB07;padding: 2px 4px;margin: 0px 4px;' >" +
                    "<span class='glyphicon glyphicon-music'></span>试听</a>" +
                    "<a role='button' class='btn_edit' onclick='editMusic("+value.id+")' style='border: 1px solid #F37B1D;padding: 2px 4px;margin: 0px 4px;'>" +
                    "<span class='glyphicon glyphicon-pencil'></span>编辑</a>" +
                    "<a role='button' class='btn_delete' onclick='delMusic("+value.id+")' style='border: 1px solid #e7505a;padding: 2px 4px;margin: 0px 4px;'>" +
                    "<span class='glyphicon glyphicon-trash'></span>删除</a>" +
                    "</td></tr>";
            });
            $("#musicList").append(val)
        },
        error:function () {
            layer.msg("系统错误！",{icon: 5});
        }
    });
}